import 'package:abc/controller/profile_controller.dart';
import 'package:abc/view/CustomAppBar.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

class ProfilePage extends GetView<ProfileController> {
  const ProfilePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    if (!Get.isRegistered<ProfileController>()) {
      Get.lazyPut(() => ProfileController());
    }
    return Scaffold(
      backgroundColor: const Color(0xFF0E0F26),
      appBar: CustomAppBar(
        title: "个人资料",
        onBack: () {
          Get.back();
        },
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(15.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              // --- 分组一：用户基本信息 (合并卡片) ---
              _buildBasicInfoCard(context),

              const SizedBox(height: 15),

              // --- 分组二：个性签名 (独立卡片) ---
              _buildCustomSignatureCard(context),
            ],
          ),
        ),
      ),
    );
  }

  // 构建基本信息卡片（头像、昵称、ID、性别）
  Widget _buildBasicInfoCard(BuildContext context) {
    return Container(
      decoration: BoxDecoration(borderRadius: BorderRadius.circular(10)),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(10),
        child: Column(
          children: [
            // 1. 用户头像
            ProfileItem(
              label: '用户头像',
              rightContent: Container(
                width: 60,
                height: 60,
                decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  image: DecorationImage(
                    image: AssetImage('assets/images/default_avatar.png'),
                    fit: BoxFit.contain,
                  ),
                ),
              ),

              onTap: () => print('修改头像'),
            ),
            // 2. 个人昵称
            Obx(
              () => ProfileItem(
                label: '个人昵称',
                rightContent: Text(
                  controller.nickName.value,
                  style: TextStyle(color: Colors.white, fontSize: 18),
                ),
                onTap: () => controller.showNickNameheet(context),
              ),
            ),
            // 3. ID (包含“复制”按钮)
            ProfileItem(
              label: 'ID',
              rightContent: Row(
                children: [
                  const Text(
                    'FH2467G',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 18,
                      height: 1,
                    ),
                  ),
                  const SizedBox(width: 8),
                  GestureDetector(
                    onTap: () => print('复制ID'), // TODO: 实现复制功能
                    child: const Text(
                      '复制',
                      style: TextStyle(
                        color: Colors.white54,
                        fontSize: 13,
                        height: 1,
                      ),
                    ),
                  ),
                ],
              ),
              onTap: null,
            ),
            // 4. 性别 (使用 Radio 按钮)
            Obx(
              () => ProfileItem(
                label: '性别',
                rightContent: Row(
                  children: [
                    _buildGenderOption('男', controller.gender.value == '男'),
                    const SizedBox(width: 59),
                    _buildGenderOption('女', controller.gender.value == '女'),
                  ],
                ),
                onTap: null,
              ),
            ),
          ],
        ),
      ),
    );
  }

  // 性别选择项
  Widget _buildGenderOption(String label, bool isSelected) {
    return GestureDetector(
      onTap: () {
        controller.toggleGender(label);
      },
      child: Row(
        children: [
          Image.asset(
            isSelected
                ? 'assets/images/icon_selected.png'
                : 'assets/images/icon_unselect.png',
            width: 24,
            height: 24,
          ),
          const SizedBox(width: 6),
          Text(
            label,
            style: const TextStyle(color: Colors.white, fontSize: 18),
          ),
        ],
      ),
    );
  }

  // 构建个性签名卡片
  Widget _buildCustomSignatureCard(BuildContext context) {
    return Container(
      padding: const EdgeInsets.only(left: 10, top: 13, bottom: 39),
      decoration: BoxDecoration(
        color: const Color(0xFF252836),
        borderRadius: BorderRadius.circular(10),
      ),
      child: InkWell(
        onTap: () => controller.showSignSheet(context),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                const Text(
                  '个性签名',
                  style: TextStyle(color: Colors.white54, fontSize: 18),
                ),
                // 箭头
                Image.asset(
                  'assets/images/ic_arrow_right.png',
                  width: 24,
                  height: 24,
                ),
              ],
            ),
            const SizedBox(height: 20),
            // 签名内容
            Obx(
              () => Text(
                controller.signContent.value,
                style: TextStyle(color: Colors.white, fontSize: 18),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class ProfileItem extends StatelessWidget {
  final String label; // 左侧标签，如“用户头像”
  final Widget rightContent; // 右侧显示内容，如头像/昵称/ID
  final VoidCallback? onTap; // 点击回调
  final BorderRadius borderRadius; // 列表项的圆角

  const ProfileItem({
    super.key,
    required this.label,
    required this.rightContent,
    this.onTap,
    this.borderRadius = BorderRadius.zero,
  });

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: onTap,
      child: Container(
        height: label == '用户头像' ? 80 : 55,
        padding: EdgeInsets.only(left: 10),
        decoration: BoxDecoration(
          color: const Color(0xFF252836), // 卡片背景色
          borderRadius: borderRadius,
        ),
        child: Column(
          children: [
            Expanded(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  // 左侧标签
                  Text(
                    label,
                    style: const TextStyle(color: Colors.white54, fontSize: 18),
                  ),
                  const Spacer(),
                  // 右侧内容
                  rightContent,
                  // 右侧箭头
                  onTap == null
                      ? SizedBox(width: 24)
                      : Image.asset(
                          'assets/images/ic_arrow_right.png',
                          width: 24,
                          height: 24,
                        ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
